import {
	ref,
	useTemplateRef,
	nextTick,
	onMounted
} from 'vue';
import { asyncHttp } from '@/common/request.js';
import type { Base } from '../common/data/base';

export const useselectPage = <T>(saveorUpdateInstance : any) => {
	//查询条件
	const form : any = ref({
		current: 1, //当前页数
		size: 10, //每页数据条数
	});
	const dataList = ref<T[]>([]);
	const selectUrl : any = ref();//查询url
	const deleteUrl = ref(''); //删除url
	const total = ref(0);
	const visible = ref(false);//添加、修改界面展示
	//获取组件实例
	type SaveOrUpdateType = InstanceType<typeof saveorUpdateInstance>;
	const saveOrUpdate = useTemplateRef<SaveOrUpdateType>("saveOrUpdate");



	const selectList = async () => {
		let result = await asyncHttp<Base>(selectUrl.value, 'post', form.value);
		dataList.value = result.dataList as T[] ?? [];
		total.value = result.total ?? 0;
		console.log(dataList.value);
	}


	const handleSave = () => {
		visible.value = true;
		nextTick(() => {
			//saveOrUpdate.value将持有 <SaveOrUpdate /> 的实例
			saveOrUpdate.value?.init();
		})
	}
	const handleEdit = (id : string) => {
		visible.value = true;

		nextTick(() => {
			if (saveOrUpdate.value) {
				saveOrUpdate.value.title = '修改';
				saveOrUpdate.value.dataForm.id = id;
				saveOrUpdate.value.init();
			}
		})
	}
	//删除
	const handleDelete = async (index : any, row : any) => {
		console.log(index, row);
		await asyncHttp(deleteUrl.value, "post", {
			id: row.id
		});

		//打开页面查询
		selectList();
	}


	//当前页数据显示条数变化
	const chandleSizeChange = (size : number) => {
		console.log(form);
		form.value.size = size;
		selectList();
	}

	//当前页数变化
	const handleCurrentChange = (current : number) => {
		form.value.current = current;
		selectList();
	}
	/**
	 * 查询所有数据，从第1页开始
	 */
	const selectAll = () => {
		//当前页数改为第1页
		form.value.current = 1;
		selectList();
	}
	//组件渲染完，加载表格数据
	onMounted(() => {
		selectAll();
	})
	return {
		form, dataList, total, selectUrl, deleteUrl, visible, selectList, handleEdit, handleSave, handleDelete, chandleSizeChange,
		handleCurrentChange, selectAll
	}

}


// export const clickButton = (title : string) => {
// 	console.log(title);
// }
// export const clickButton1 = (title : any) => {
// 	console.log(title);
// }
// export const clickButton2 = (title : string | number) => {
// 	console.log(title);
// }
// export const clickButton3 = (title : string | number = '11') => {
// 	console.log(title);
// }
// const clickButton4 = (title ?: string | number) => {
// 	console.log(title);
// }
// const clickButton5 = (title : string, ...params : string[]) => {
// 	console.log(title);
// }
// type uniteType = string | number
// export const clickButton6 = () : string | number => {
// 	console.log('clickButton6');
// 	return '';
// }
// export const clickButton7 = () : void => {
// 	console.log('clickButton7');
// }
// export const clickButton8 = () : uniteType => {
// 	console.log('clickButton8');
// 	return '';
// }



//默认导出一个
// export default clickButton

//导出多个
export {
	// clickButton4,
	// clickButton5
}